/**
 *
 * Copyright 2018 Google Inc. All rights reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

const html = String.raw;

export class LoginButton extends HTMLElement {
  static template() {
    return html`
      <button id="btnLogin" class="sc-btn">Login</button>
    `;
  }
  connectedCallback() {
    this.appendChild(template.content.cloneNode(true));
    this.auth = firebase.auth();
    this.btnLogin = this.querySelector('#btnLogin');

    this.auth.onAuthStateChanged(user => {
      const event = new CustomEvent('on-auth', { detail: user });
      this.user = user;
      this.dispatchEvent(event);
    });

    this.btnLogin.addEventListener('click', e => {
      const google = new firebase.auth.GoogleAuthProvider();
      this.auth.signInWithRedirect(google);
    });
  }
}

let template = document.createElement('template');
template.innerHTML = LoginButton.template();

